<?php
include_once("../../php/include_all.php");
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link href="../../css/bootstrap.min.css" rel="stylesheet">
</head>

<body>
<div class="row-fluid sortable">
	<div class="box span12 geo-box">
		<div class="box-header well">
			<h2><i class="icon-edit"></i> &nbsp; Visi</h2>
		</div>
		<div class="box-content">
                    <div class="accordion" id="accordion2">
                    	<div class="accordion-group">
                        	<div class="accordion-heading"><a class="btn btn-primary" data-toggle="collapse" data-parent="#accordion2" href="#collapseTwo">Tambah Data</a></div>
                            <div id="collapseTwo" class="accordion-body collapse">
                            	<div class="accordion-inner">
                                	<form id="form_visi" class="form-horizontal"  method="post" action="">
                                    	<input type="hidden" name="act" value="simpan_visi">
                                        <table class="table-form">
                                        	<input type="hidden" id="id_visi" name="id_visi" value="0">
                                        	<tr><td>Visi</td><td>&nbsp;</td><td><textarea  class="input-xxlarge" rows="3" id="visi" name="visi"></textarea></td></tr>
                                        	<tr><td>Periode</td><td>&nbsp;</td><td><input type="text" id="periode" name="periode" ></td></tr>
                                        </table>
                                        <table align="right">
                                            <tr>
                                                <td></td><td></td><td><input type="button" class="btn btn-primary bt-simpan-visi" value="Simpan" />
                                            </tr>
                                        </table>
                                    </form>
                                </div>
                            </div>
                            <hr/>
                            <table class="table table-bordered" align="center" width="100%">
                                <thead>
                                    <tr>
                                        <th width="5%" style="text-align:center">NO</th>
                                        <th width="75%" >VISI</th>
                                        <th width="10%" style="text-align:center">PERIODE</th>
                                        <th width="10%" style="text-align:center">&nbsp;</th>
                                    </tr>
                                </thead>
                                <?php
                                	$t_visi = get_datas ("select * from rpjm_visi order by id_visi");
									$no=1;
									foreach ($t_visi as $visi){
								?>
                                <tbody id="tbody_visi">
                                	<tr>
                                    	<td style="text-align:center"><?php echo $no; ?></td>
                                        <td><?php echo $visi ['visi'];?></td>
                                    	<td style="text-align:center"><?php echo $visi['periode']; ?></td>
                                        <td style="text-align:center"><a href="#collapseTwo" data-toggle="collapse" data-parent="#accordion2" class="btn btn-info btn-small bt-edit-visi" name="<?php echo $visi['id_visi']; ?>"><i class="icon-edit icon-white"></i>Ubah</a></td>
                                    </tr>
                                </tbody>
                                <?php
								$no++;
                                	}
								?>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
      	</div>
              
<script type="text/javascript">
	var urls = 'aksi.php';
	
	$('.bt-simpan-visi').click(function(){
	var btn  = $(this);
	var load = $('#loader');
	var rslt = $('#result');
	load.addClass('spinner pull-left');
	btn.removeClass('btn-primary').addClass('btn-info');
	
	var form = $('#form_visi');
	var data = form.serializeArray();
	var post = $.post(urls,data);
	post.done(function(res){
		var result = res.split('__');
		//   0      1     2 
		//success__idkeg__(isi tbody)tr
		if(result.length==3){
			if(result[0]=='success'){
				rslt.html('<font color="green">tersimpan...</font>');
				setTimeout(function(){
					rslt.html('');
				},1500);
				
				var tbody = $('#tbody_visi');
				tbody.html(result[2]);
				init();
			}else{
				rslt.html('<font color="red">'+res+'</font>');
			}
		}else{
			rslt.html('<font color="red">'+res+'</font>');
		}
		load.removeClass();
		btn.removeClass('btn-info').addClass('btn-primary');
		var col =	$('#collapseTwo');
		col.removeClass('in');
		col.css('height','0');
	});
});

function init(){
	$('.bt-edit-visi').click(function(){
		var idvisi= this.name;
		var form = $('#form_visi');
		var post = $.post(urls,{act:'edit_visi',idvisi:idvisi});
		post.done(function(res){
			var value = res.split('__');
			
			//  0        1       2      
			//id_visi__visi__periode
			$('#id_visi').val(value[0]);
			form.find('textarea[name="visi"]').html(value[1]);
			form.find('input[name="periode"]').val(value[2]);
			//console.log(res);
		});
	});
}
init();
</script>
</body>
</html>
